<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/jsp/common/include.jsp"%>
<script type="text/javascript">

	$(document).ready(function(){
		$('#ff .easyui-validatebox').attr("readonly","readonly").css("background-color","#F5F5F5");
		$('#detail').css("background-color","#F5F5F5");
		
		$('#userDataGrid').datagrid({  
			onSelect: function(index,row){  
		        //alert(index+":"+row);
				$('#ff').form('clear');
				$('#ff').form('load',row);
		    },
		    onBeforeLoad:function(param){
		    	//alert("before load");
		    },
		    onLoadSuccess : function(data) {
			  //alert(data);
			},
			onLoadError : function(XMLHttpRequest,textStatus,errorThrown) {
			   //alert(XMLHttpRequest.status);
	            //alert(XMLHttpRequest.readyState);
	            //alert(textStatus);
				//alert("新增失败！");
			}
		});  
	});

	function reloadUsers() {
		$('#userDataGrid').datagrid('reload');
		$('#userDataGrid').datagrid('clearSelections');
		$('#ff').form('clear');
	}

	function addUser(){
		$('#ff input').removeAttr("readonly").css("background-color","white");
		$('#detail').css("background-color","white");
		$('a.easyui-linkbutton').linkbutton('enable');
		$('#ff .easyui-datebox').datebox('enable');
		$('#ff .easyui-combobox').combobox('enable');
		$('#ff').form('clear');
		//alert("add user!");
		//$('#ff .easyui-combobox').combobox('disable');
		//$('#ff .easyui-combobox').combobox('disable');
	}
	
	function updUser(){
		var rows = $('#userDataGrid').datagrid('getSelections');
		if (rows.length != 1) {
			$.messager.alert('消息', '请勾选一行数据!', 'info');
			return;
		}
		$('#ff input').removeAttr("readonly").css("background-color","white");
		$('#detail').css("background-color","white");
		$('a.easyui-linkbutton').linkbutton('enable');
		$('#ff .easyui-datebox').datebox('enable');
		$('#ff .easyui-combobox').combobox('enable');
	}
	
	function delUsers(){
		//var rows = $('#userDataGrid').datagrid('getSelections');
		var rows = $('#userDataGrid').datagrid('getChecked');
		if (rows.length > 0) {
		    var ids = '';
			for ( var i = 0; i < rows.length; i++) {
						ids += 'ids=' + rows[i].id + '&';
			}
			ids = ids.substring(0, ids.length - 1);
			var url = 'sysadmin/userManage/del?' + ids;
			$.messager.confirm('Confirm','确定要删除选择的数据吗?', function() {
			    $.getJSON(
			    	url, 
			    	function(result){
						if (result.success){ 
							$.messager.alert('消息', '删除成功！','info');
							$('#userDataGrid').datagrid('reload');
							$('#userDataGrid').datagrid('clearSelections');
						} else {  
						    //$.messager.show({ title: 'Error', msg : result.msg }); 
							$.messager.alert('消息', '删除失败:'+result.msg,'info');
						} 
			    	});
			});
		} else {
			$.messager.alert('消息', '请选择要删除的数据!','info');
		}
	}
	
	function searchUser(){
		$('#ff .easyui-linkbutton').linkbutton('enable');
	}
	
	function submitForm() {
		var json = JSON.stringify($('#ff').serializeJson());
		$.ajax( {
			type : 'POST',
			contentType : 'application/json',
			url : 'sysadmin/userManage/upd',
			dataType : 'json',
			data : json,
			beforeSend : function(xhr, opts){
				alert("chedking before send");
		        if($('#ff').form('validate') == false){
		            xhr.abort();
		        }
		    },
			success : function(result) {
				//alert(result.success)
				if (result.success == 'true'){ 
					$.messager.alert('消息', '修改成功！','info');
					$('#userDataGrid').datagrid('reload');
					//$('#userDataGrid').datagrid('clearSelections');
					
					$('#ff .easyui-validatebox').attr("readonly","readonly").css("background-color","#F5F5F5");
					$('#detail').css("background-color","#F5F5F5");
					
					$('#ff .easyui-datebox').datebox('disable').css("background-color","#F5F5F5");
					$('#ff .easyui-combobox').combobox('disable').css("background-color","#F5F5F5");
				} else {  
				    //$.messager.show({ title: 'Error', msg : result.msg }); 
					$.messager.alert('消息', '修改失败:'+result.msg,'info');
				}
			},
			error : function(XMLHttpRequest,textStatus,errorThrown) {
			  alert(XMLHttpRequest.status+"||"+XMLHttpRequest.readyState+"||"+textStatus);
				//$.messager.alert('消息', '修改失败','info');
			}
		});
	}
	
	function cancelForm() {
	    alert("cencel");
	}
</script>
	<!-- datagrid -->
	<table id="userDataGrid" class="easyui-datagrid" style="width:900px;height:250px"
			data-options="
				rownumbers:true,
				singleSelect:true,
				checkOnSelect:false,
				selectOnCheck:false,
				url:'sysadmin/userManage/list',
				pagination:true,
				pageSize:<%=Constant.PAGE_SIZE%>,
				pageList:<%=Constant.PAGE_LIST%>,
				toolbar:'#userToolbar'">
		<thead>
			<tr>
				<th field="ck" checkbox="true"></th>
				<th field="id" width="10" hidden="true"><spring:message code="user.id" /></th>
				<th field="loginId" width="80" sortable="true"><spring:message code="user.loginId" /></th>
				<th field="name" width="80" sortable="true"><spring:message code="user.name" /></th>
				<th field="sex" width="100" sortable="true"><spring:message code="user.sex" /></th>
				<th field="dob" width="80" sortable="true"><spring:message code="user.dob" /></th>
				<th field="tel" width="80" sortable="true"><spring:message code="user.tel" /></th>
				<th field="livingAddr" width="80" sortable="true"><spring:message code="user.livingAddr" /></th>
				<th field="isAdmin" width="50" sortable="true"><spring:message code="user.isAdmin" /></th>
			</tr>
		</thead>
	</table>
	
	<!-- toolbar -->
	<div id="userToolbar" style="padding:5px;height:auto">
		<div style="margin-bottom:5px">
			
			<a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="javascript:addUser()">新增</a>
			<a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-edit" plain="true" onclick="javascript:updUser()">修改</a>
<!-- 			<a href="#" class="easyui-linkbutton" iconCls="icon-save" plain="true" onclick="javascript:updUser()"></a> -->
			<a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="javascript:delUsers()">删除</a>
			<a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-reload" plain="true" onclick="javascript:reloadUsers()" >刷新</a>
		</div>
		<div>
			姓名:<input id="search-name" class="easyui-validatebox" style="width:80px"/>
			电话：<input id="search-tel" class="easyui-validatebox" style="width:80px"/>
			住址：<input id="search-livingAddr" class="easyui-validatebox" style="width:150px"/>
			<a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-search" onclick="javascript:searchUser()">搜索</a>
		</div>
	</div>
	
	<!-- detail form -->
	<div id="detail" class="easyui-panel" style="width:900px;padding:10px 10 10px 10px;">
		<div style="margin-bottom:5px">
			<a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-save" plain="true" onclick="javascript:submitForm()" disabled>保存</a>
			<a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-cancel" plain="true" onclick="javascript:cancelForm()" disabled>取消</a>
		</div>
	    <form id="ff" method="post" onSubmit="javascript:void(0)">
	    	<input name="id" hidden="true" class="easyui-validatebox"/>
	    	
	    	<table>
	    		<tr>
	    			<td><spring:message code="user.loginId" />:<input name="pwd" value="123456" class="easyui-validatebox"/></td>
	    			<td><input name="loginId" class="easyui-validatebox" required="true"/></td>
	    		</tr>
	    		<tr>
	    			<td><spring:message code="user.name" />:</td>
	    			<td><input name="name" class="easyui-validatebox" required="true"/></td>
	    		</tr>
	    		<tr>
	    			<td><spring:message code="user.sex" />:</td>
	    			<td>
	    				<select name="sex" class="easyui-combobox" required="true" disabled>
<!-- 	    					<option value="" selected>==请选择==</option> -->
		    				<option value="M">男</option>
		    				<option value="F">女</option>
	    				</select>
	    			</td>
	    		</tr>
	    		<tr>
	    			<td><spring:message code="user.dob" />:</td>
	    			<td><input name="dob" class="easyui-datebox" data-options="formatter:dateFormatter,parser:dateParser" required="true" disabled/></td>
	    		</tr>
	    		<tr>
	    			<td><spring:message code="user.photo" />:</td>
	    			<td><input name="photo" class="easyui-validatebox"/></td>
	    		</tr>
	    		<tr>
	    			<td><spring:message code="user.tel" />:</td>
	    			<td><input name="tel" class="easyui-validatebox"/></td>
	    		</tr>
	    		<tr>
	    			<td><spring:message code="user.livingAddr" />:</td>
	    			<td><input name="livingAddr" class="easyui-validatebox"/></td>
	    		</tr>
	    		<tr>
	    			<td><spring:message code="user.hometown" />:</td>
	    			<td><input name="hometown" class="easyui-validatebox"/></td>
	    		</tr>
	    		<tr>
	    			<td><spring:message code="user.isAdmin" />:</td>
	    			<td>
	    				<select name="isAdmin" class="easyui-combobox" required="true" disabled>
		    				<option value="Y">是</option>
		    				<option value="N">否</option>
	    				</select>
	    			</td>
	    		</tr>
	    	</table>
	    	
	    </form>
	</div>